<template>
  <div style="margin: 0 5px;display: inline-block;">
    <el-button type="primary" size="mini" icon="el-icon-plus" round @click="ShowNewPackage">添加包</el-button>
    <el-dialog title="添加扩展包" :visible.sync="is_show_package" :close-on-click-modal="false" width="30%" center>
      <el-form label-position="left" label-width="50px" :model="new_package" size="mini">
        <el-form-item label="名称">
          <el-input v-model="new_package.name" size="mini"></el-input>
        </el-form-item>
        <el-form-item label="版本">
          <el-input v-model="new_package.version" size="mini"></el-input>
        </el-form-item>
        <el-form-item label="类型">
          <el-select v-model="new_package.type" placeholder="选择类型" size="mini" clearable>
            <el-option v-for="t in typeData" :key="t.value" :label="t.name" :value="t.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="链接">
          <el-input v-model="new_package.url" size="mini"></el-input>
        </el-form-item>
        <el-form-item label="分类">
          <el-select v-model="new_package.include_id" placeholder="选择分类" size="mini" clearable>
            <el-option v-for="item in includesData" :key="item.id" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="is_show_package = false" size="mini">取 消</el-button>
        <el-button type="primary" @click="SavePackage" size="mini">添 加</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>

import axios from "axios";

export default {
  name: "CreatePackage",
  props: {
    includesData: Array,
  },
  data() {
    return {
      is_show_package: false,
      new_package: {
        include_id: 0,
        name: "",
        version: "*",
        url: "https://packagist.org",
        type: 0
      },
      typeData: [{
        name: 'composer',
        value: 0
      }, {
        name: 'git',
        value: 1
      }],
    }
  },
  methods: {
    ShowNewPackage() {
      this.new_package.name = ""
      this.new_package.url = "https://packagist.org"
      this.new_package.version = "*"
      this.new_package.include_id = ""
      this.new_package.type = 0
      this.is_show_package = true
    },
    SavePackage() {
      axios({
        url: '/collector/packages/add',
        method: 'post',
        data: {
          name: this.new_package.name,
          version: this.new_package.version,
          url: this.new_package.url,
          include_id: this.new_package.include_id,
          type: this.new_package.type,
        }
      }).then(({data}) => {
        if (data.code != 0) {
          this.$notify({
            title: '失败',
            message: data.msg,
            type: 'error'
          })
          return
        }
        window.location.reload()
      }).catch(err => {
        this.$notify({
          title: '失败',
          message: err.message,
          type: 'error'
        })
      })
      this.is_show_package = false
    }
  }
}
</script>